<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <link rel="stylesheet" type="text/css" href="../res/static/css/main.css">
  <link rel="stylesheet" type="text/css" href="../res/layui/css/layui.css">
  <script type="text/javascript" src="../res/layui/layui.js"></script>
  <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
  <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
</head>
<body>

  <div class="site-nav-bg">
    <div class="site-nav w1200">
      <p class="sn-back-home">
        <i class="layui-icon layui-icon-home"></i>
        <a href="#">首页</a>
      </p>
      <div class="sn-quick-menu">
        <div class="login"><a href="login.html">登录</a></div>
        <div class="sp-cart"><a href="shopcart.html">购物车</a><span>2</span></div>
      </div>
    </div>
  </div>



  <div class="header">
    <div class="headerLayout w1200">
      <div class="headerCon">
         <h1 class="mallLogo">
          <a href="#" title="数码商城">
            <img src="../res/static/img/logo.png.jpg" height="50" width="80">
          </a>
        </h1>
        <div class="mallSearch">
          <form action="" class="layui-form" novalidate>
            <input type="text" name="title" required  lay-verify="required" autocomplete="off" class="layui-input" placeholder="请输入需要的商品">
            <button class="layui-btn" lay-submit lay-filter="formDemo">
                <i class="layui-icon layui-icon-search"></i>
            </button>
            <input type="hidden" name="" value="">
          </form>
        </div>
      </div>
    </div>
  </div>


  <div class="content content-nav-base  login-content">
    <div class="main-nav">
      <div class="inner-cont0">
        <div class="inner-cont1 w1200">
          <div class="inner-cont2">
            <a href="commodity.html" class="active">所有商品</a>
            <a href="buytoday.html">今日团购</a>
            <a href="information.html">数码资讯</a>
            <a href="about.html">关于我们</a>
          </div>
        </div>
      </div>
    </div>
    <div class="login-bg">
      <div class="login-cont w1200">
        <div class="form-box">
          <form id="f1" class="layui-form" action="">
              <legend>账号登录</legend>
              <div class="layui-form-item">
                <div class="layui-inline username">
                  <div class="layui-input-inline">
                    <i class="layui-icon layui-icon-username username-icon"></i>
                    <input type="text" name="user_name" id="user_name" lay-verify="required" placeholder="请输入用户名" autocomplete="off" class="layui-input">
                  </div>
                </div>
                <div class="layui-inline password">
                  <div class="layui-input-inline">
                    <i class="layui-icon layui-icon-password password-icon"></i>
                    <input type="password" name="user_password" id="user_password" lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input">
                  </div>
                </div>
                <div class="layui-form-item login-btn">
                    <div class="layui-input-block">
                      <button class="layui-btn" lay-submit="" lay-filter="name" >登录</button>
                    </div>
                  </div>
              </div>
            </form>
        </div>
      </div>
    </div>
  </div>

  <div class="footer">
    <div class="ng-promise-box">
      <div class="ng-promise w1200">
        <p class="text">
          <a class="icon1" href="javascript:;">7天无理由退换货</a>
          <a class="icon2" href="javascript:;">满99元全场免邮</a>
          <a class="icon3" style="margin-right: 0" href="javascript:;">100%品质保证</a>
        </p>
      </div>
    </div>
    <div class="mod_help w1200">                                     
      <p>
        <a href="javascript:;">关于我们</a>
        <span>|</span>
        <a href="javascript:;">帮助中心</a>
        <span>|</span>
        <a href="javascript:;">售后服务</a>
        <span>|</span>
        <a href="javascript:;">数码资讯</a>
        <span>|</span>
        <a href="javascript:;">关于货源</a>
      </p>
      <p class="coty">数码商城版权所有 &copy; 2012-2020</p>
    </div>
  </div>
  <script type="text/javascript">
   layui.config({
      base: '../res/static/js/util/' //你存放新模块的目录，注意，不是layui的模块目录
    }).use(['jquery','form','cookie','element'],function(){
          var $ = layui.$,form = layui.form,
           cookie = layui.cookie,
		   element = layui.element;
		 //如果sessionStorage中已有user，则说明已登录过，跳转到首页
			 if(sessionStorage.getItem("users")!=null){
			  location.href = "index.html";
			 }
		 //监听用户名登录按钮
		 form.on('submit(name)', function(data){
			$.post(
				"../../users/login.do",
				data.field,
				function(res){
					console.log(res);
					 if(res.code==200){
					 	//保存token用来判断用户是否登录，和身份是否属
					 	$.cookie('token',res.data.token);
					 	//保存用户信息到session
					 	sessionStorage.setItem('users',JSON.stringify(res.data.users));
						//跳转到主页面
					 	location.href="index.html";
					 }else{
					 	layer.msg("用户名或密码错误！");
					 }
				},"json"
			);
			return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
		});

    })
  </script>

</body>
</html>